<%@page import="org.ifilm.util.GeneralConstants"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>Appliers</title>
		<link rel="icon" type="image/png" href="/film/img/favicon.ico">
		<link href="/film/bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen"/>
		<script src="/film/js/jquery.js"></script>
	    <script src="/film/bootstrap/js/bootstrap.min.js"></script>
	    <script src="/film/bootstrap/js/typeahead.js"></script>
	    <style>
	      	body {
	        	padding-top: 60px; /* 60px to make the container go all the way to the bottom of the topbar */
	      	}
	    </style>
	</head>
	<body>
		<jsp:include page="navigationBar.jsp"/>
		<div class="container">
			 <div class="content-container">
				<c:forEach var="p" items="${projects}">
					<a href='/film/project/getProject.do?pid=${p.id}'><h3>${p.projectName}</h3></a>
					<h6>Job Applications</h6>
					<c:forEach var="j" items="${p.jobPostings}">
						<c:forEach var="a" items="${j.jobApplications}">
							<!-- ${p.projectName}, ${j.type}, ${a.applier.name}, ${a.applier.surname}  -->
							<div id="applications" class="accordion-group">
								<div class="accordion-heading">
									<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#${a.id}_${a.applier.id}">
									<h4 style="display:inline">${a.applier.name} applies for ${j.type} position</h4>
									<c:if test="${a.status == 'pending'}">
										<button class="btn btn-danger pull-right response" id="${a.id}">Reject</button> 
										<button class="btn btn-primary pull-right response" id="${a.id}">Accept</button> 
									</c:if>
									<span class="label label-info pull-right">Status: ${a.status} </span>				
									</a>
								</div>
								<div id="${a.id}_${a.applier.id}" class="accordion-body collapse">
									<div class="accordion-inner">
										<table width=100% class="table">
											<c:set var="frontCam" value="${j.type == 'actor' or j.type == 'actress' or j.type == 'dublour'}"/>
											<tr>
												<td colspan=2>
													<h4><a href='/film/user/getUser.do?userId=${a.applier.id}'>${a.applier.name} ${a.applier.surname}</a></h4>
													${a.applier.professionalInfo}
												</td>
											</tr>
											<c:if test="${frontCam == true}">
									 			<tr>
													<td>Height:</td>
													<td>
														${a.applier.height} cm
													</td>
												</tr>
												<tr>
													<td>Weight:</td>
													<td>
														${a.applier.weight} kg
													</td>
												</tr>
				
												<tr>
													<td>Hair Color:</td>
													<td>
														${a.applier.hairColor}
													</td>
												</tr>
												<tr>
													<td>Eye Color:</td>
													<td>
														${a.applier.eyeColor}
													</td>
												</tr>
									 		</c:if>
										</table>
									</div>
								</div>
							</div>
							<br/>
						</c:forEach>
					</c:forEach>
					<h6>Equipment Offerings</h6>
					<c:forEach var="j" items="${p.equipmentPostings}">
						<c:forEach var="a" items="${j.equipmentOffers}">				
							<div id="applications" class="accordion-group">
								<div class="accordion-heading">
									<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#${a.id}_${a.offerer.id}">
									<h4 style="display:inline">${a.offerer.name} offers for ${j.description}</h4>
									<c:if test="${a.status == 'pending'}">
										<button class="btn btn-danger pull-right response" id="${a.id}">Reject</button> 
										<button class="btn btn-primary pull-right response" id="${a.id}">Accept</button> 
									</c:if>
									<span class="label label-info pull-right">Status: ${a.status} </span>				
									</a>
								</div>
								<div id="${a.id}_${a.offerer.id}" class="accordion-body collapse">
									<div class="accordion-inner">
										<table width=100% class="table">
											<tr>
												<td colspan=2>
													<h4><a href='/film/user/getUser.do?userId=${a.offerer.id}'>${a.offerer.name} ${a.offerer.surname}</a></h4>
													${a.offerer.professionalInfo}
												</td>
											</tr>					
										</table>
									</div>
								</div>
							</div>
							<br/>
						</c:forEach>
					</c:forEach>
				</c:forEach>
			</div>
		</div>
		<script>
		$(".response").click(function() {
			var jobApplicationId = $(this).attr('id');
			
			if ($(this).html() == "Reject" ) {
				var response = "<%=GeneralConstants.APPLY_REJECTED%>";
			} else {
				var response = "<%=GeneralConstants.APPLY_ACCEPTED%>";
			}
			$.ajax({
				url : "/film/notice/respondToPosting.do?jobApplicationId=" + jobApplicationId + "&responseText=" + response,
				success : function(data) {
					alert("Successful");
				}
			});
		});
		
		</script>
		
	</body>
	
	<script src="/film/js/commonScripts.js"></script>
</html>